<template>
  <div id="app">
    <!-- 使用 keep-alive 组件包裹 让Home不随意销毁掉 缓存到内存中  -->
    <!-- <keep-alive>
      <router-view v-if="$route.meta.keepAlive"></router-view>
    </keep-alive>-->
    <router-view></router-view>
  </div>
</template>

<script>
import { mapState } from "vuex";
export default {
  name: "App",
  data() {
    return {
      state: { clientHeight: 0 },
    };
  },
  computed: {
    ...mapState(["isAppending"]),
  },
  mounted() {
    // 禁止双指放大
    document.addEventListener("gesturestart", function (event) {
      event.preventDefault();
    });
    // 禁止双击放大
    var lastTouchEnd = 0;
    document.documentElement.addEventListener(
      "touchend",
      function (event) {
        var now = Date.now();
        if (now - lastTouchEnd <= 300) {
          event.preventDefault();
        }
        lastTouchEnd = now;
      },
      false
    );
    window.onload = function () {
      document.addEventListener("gesturestart", function (e) {
        e.preventDefault();
      });
      document.addEventListener("dblclick", function (e) {
        e.preventDefault();
      });
      document.addEventListener("touchstart", function (event) {
        if (event.touches.length > 1) {
          event.preventDefault();
        }
      });
      var lastTouchEnd = 0;
      document.addEventListener(
        "touchend",
        function (event) {
          var now = new Date().getTime();
          if (now - lastTouchEnd <= 300) {
            event.preventDefault();
          }
          lastTouchEnd = now;
        },
        false
      );
    };
  },

  methods: {},

  watch: {
    isAppending(val) {
      // 如果状态是true 展示加载状态 否则 清空状态
      val
        ? this.$toast.loading({
            message: "加载中...",
            duration: 0,
            forbidClick: true,
          })
        : this.$toast.clear();
    },
  },
};
</script>

<style lang="less">
@import url("./assets/css/common.css");
@supports (bottom: constant(safe-area-inset-bottom)) or (bottom: env(safe-area-inset-bottom)) { 
	.bottom-button {
    	margin-bottom: constant(safe-area-inset-bottom);
        margin-bottom: env(safe-area-inset-bottom);  
    }
}
</style>
